<template>
    <div
        class="dailylist_cancel-contnair"
        v-loading="isLoading"
        element-loading-background="rgba(250, 250, 250, 0.7)"
    >
        <!-- 按日贷款撤销 -->
        <!-- <el-card
      shadow="never"
      v-loading="isLoading"
      element-loading-background="rgba(250, 250, 250, 0.7)"
    >
      <div slot="headerss" class="clearfix">
        <span>按日贷款撤销</span>
        <el-button style="float: right; padding: 3px 20px;" type="text" @click="showTrial=false">关 闭</el-button>
        </div>-->
        <cardComponent pageTitle="按日贷款撤销">
            <template slot="cardBody">
                <el-form ref="form" :model="DailylistCancelForm" label-width="110px" size="small">
                    <el-row :gutter="8">
                        <el-col :span="6">
                            <el-form-item label="账户类别 : ">
                                <el-input
                                    disabled
                                    v-model="DailylistCancelForm.CATEGORY"
                                    style="width: 100%;"
                                ></el-input>
                            </el-form-item>
                        </el-col>
                        <el-col :span="7">
                            <el-form-item label="主卡卡号 : ">
                                <el-input
                                    disabled
                                    v-model="DailylistCancelForm.CARDNBR"
                                    style="width: 100%;"
                                ></el-input>
                            </el-form-item>
                        </el-col>
                        <el-col :span="6">
                            <el-form-item label="分期付款类型 : ">
                                <el-select
                                    v-model="DailylistCancelForm.MPTYPE"
                                    style="width: 100%;"
                                >
                                    <el-option label="按日贷款" value="W"></el-option>
                                </el-select>
                            </el-form-item>
                        </el-col>
                        <el-col :span="5">
                            <el-form-item e="small" label-width="15px">
                                <el-button type="primary" size="small" @click="onQuery">查 询</el-button>
                                <!-- <el-button type="primary" size="small" @click="onReset">重 置</el-button> -->
                            </el-form-item>
                        </el-col>
                    </el-row>
                </el-form>

                <!-- 按日贷款撤销详情 -->
                <el-card style="width: 100%" shadow="never" v-if="showTrial">
                    <div slot="headerss" class="clearfix">
                        <span>按日贷款撤销 (账户类别： {{DailylistCancelForm.CATEGORY}} )</span>
                        <el-button
                            style="float: right; padding: 3px 20px;"
                            type="text"
                            @click="showTrial=false"
                        >关 闭</el-button>
                    </div>
                    <div>
                        <el-table
                            :data="tableData"
                            border
                            stripe
                            style="width: 100%;"
                            highlight-current-row
                            @current-change="handleCurrentChange"
                            class="heard-bg business_table"
                        >
                            <el-table-column width="25">
                                <template slot-scope="scope">
                                    <el-radio v-model="id" :label="scope.row.APPREF">{{""}}</el-radio>
                                </template>
                            </el-table-column>
                            <el-table-column prop="APPREF" label="分期付款申请编号" min-width="133"></el-table-column>
                            <el-table-column prop="INPDATE" label="申请录入日期" min-width="105"></el-table-column>
                            <el-table-column prop="PRPRDID" label="商品编号" min-width="95"></el-table-column>
                            <el-table-column prop="PRONAME" label="商品名称" min-width="120"></el-table-column>
                            <el-table-column prop="MPAMT" label="商品金额" min-width="90"></el-table-column>
                            <el-table-column prop="NBRMTHS" label="分期期数" min-width="77"></el-table-column>
                            <el-table-column prop="STATUS_1" label="状 态" min-width="95"></el-table-column>
                            <el-table-column prop="INPSRC_1" label="申请分期付款类型" min-width="133"></el-table-column>
                            <el-table-column prop="AUTHDAY" label="授权日期" min-width="92"></el-table-column>
                            <el-table-column prop="MATCHDAY" label="请款日期" min-width="92"></el-table-column>
                        </el-table>
                        <div class="footer">
                            <el-button type="primary" size="small" @click="onCheXiao">撤销申请</el-button>
                            <el-button type="primary" size="small" @click="onYanQi">撤销延期</el-button>
                            <el-button
                                :disabled="currentPageIndex <= 0"
                                type="primary"
                                size="small"
                                @click="handleChangePage('pre')"
                            >上一页</el-button>
                            <el-button
                                :disabled="nextButtonFlag"
                                type="primary"
                                size="small"
                                @click="handleChangePage('next')"
                            >下一页</el-button>
                            <!-- <el-button size="small" @click="showTrial = false">关闭</el-button> -->
                        </div>
                    </div>
                </el-card>
            </template>
        </cardComponent>
        <!-- </el-card> -->
    </div>
</template>

<script>
import { mapState } from 'vuex';
import moment from 'moment';
import cardComponent from '@/components/cardComponent/cardComponent.vue';
// import common from '../../../stores/common';
import { setNumber, ChangePage } from '@/utils/Object';
import { get_3xxx, get_4xxx } from '@/apis/getAPIClass';
import { getDictSelectList, getDictMappingValue } from '@/utils/Common';

export default {
    data() {
        return {
            DailylistCancelForm: {
                CATEGORY: '',
                CARDNBR: '',
                MPTYPE: 'W',
            },
            tableData: [],
            id: '',
            showTrial: false,
            isLoading: false,
            currentRow: null,
            pagingDataList: [], // 翻页上送字段列表
            currentPageIndex: 0, // 当前页,
            nextButtonFlag: true, // 下翻页按钮 显示控制阀,
            APPREF: '',
            RTNIND: '',
            _3105res: {},
            _4098res: {},
            STATUSList: [],
            INPSRCList: [],
        };
    },
    name: 'DailylistCancel',
    components: {
        cardComponent,
    },
    computed: {
        ...mapState({
            defaultParams: state => state.common.defaultParams, // 接口默认参数
            cardInfo_3004: state => state.common.cardInfo_3004,
            cardList_3601: state => state.common.cardList_3601,
            pinFlag: state => state.common.pinFlag, // 是否密码检查标志
        }),
    },
    async mounted() {
        // 获取账户类别
        const MY_CATEGORY = await getDictMappingValue('CATE', this.cardInfo_3004.CATEGORY, this) || this.cardInfo_3004.CATEGORY;
        this.DailylistCancelForm.CATEGORY = MY_CATEGORY;
        this.onLoadOBJ();
    },
    methods: {
        async onLoadOBJ() {
            this.DailylistCancelForm.CARDNBR = this.cardInfo_3004.CARDNO;
            try {
                this.STATUSList = await getDictSelectList('MPAPPSTATUS', this);
            } catch (error) {
                console.warn('状态获取失败');
            }
            try {
                this.INPSRCList = await getDictSelectList('INPSRC', this);
            } catch (error) {
                console.warn('付款类型获取失败');
            }


            console.log(this.STATUSList, this.INPSRCList);
            // this.DailylistCancelForm.CATEGORY = this.cardInfo_3004.CATEGORY;
        },
        handleCurrentChange(val) {
            this.currentRow = val;
            if (!val) return false;
            this.id = val.APPREF || '';
        },
        // 查询
        onQuery() {
            this.pagingDataList = []; // 清空缓存 申请编号 -> 相当于首次查询
            this.currentRow = null;
            this.id = '';
            this.APPREF = '';
            this.RTNIND = '';
            this.get_3046();
        },
        // 请求 3046接口
        async get_3046() {
            this.isLoading = true;
            // 3046 配置请求头
            const appBody_3046 = {
                CARDNBR: this.DailylistCancelForm.CARDNBR,
                OPT: 1,
                PINFLAG: this.pinFlag,
                APPREF: this.APPREF, // 分期付款申请编号 首次查询上送空；下翻页查询时上送最后一条记录中的分期付款申请编号；
                RTNIND: this.pagingDataList.length === 0 ? '' : 1, // 翻页标志 首次传空， 翻页传1
                MPTYPE: this.DailylistCancelForm.MPTYPE,
            };
            let bool = false;
            if (this.APPREF === '') bool = true;
            // 发送_3046请求
            const result_3046 = await get_3xxx(
                '3046',
                '按日贷款撤销查询',
                appBody_3046,
                this,
                true,
                bool,
            );
            // 如果传过来的为空, 则无下翻页 ,将下翻按钮禁用
            if (!result_3046) {
                if (this.pagingDataList.length != 0) {
                    this.$message.warning('已经到最后一条数据');
                }
                this.nextButtonFlag = true;
                return false;
            }
            const res = result_3046.body.appBody.dataList;
            res.forEach((item) => {
                item.MPAMT = item.MPAMT.toFixed(2);
                if (item.MATCHDAY.trim()) item.MATCHDAY = moment(`${item.MATCHDAY}`).format('YYYY-MM-DD');
                if (item.AUTHDAY.trim()) item.AUTHDAY = moment(`${item.AUTHDAY}`).format('YYYY-MM-DD');
                if (item.INPDATE.trim()) item.INPDATE = moment(`${item.INPDATE}`).format('YYYY-MM-DD');
                // 设置状态情况
                item.STATUS_1 = item.STATUS;
                this.STATUSList.forEach((i) => {
                    if ((`${item.STATUS}`).trim() == i.code) {
                        item.STATUS_1 = i.label;
                    }
                });

                item.INPSRC_1 = '';
                this.INPSRCList.forEach((i) => {
                    if ((`${item.INPSRC}`).trim() == i.code) {
                        item.INPSRC_1 = i.label;
                    }
                });
                // if (item.STATUS.trim() == 30) item.STATUS = "待请款状态";
                // if (item.STATUS.trim() == 40) item.STATUS = "已请款";
                // if (item.STATUS.trim() == 90) item.STATUS = "申请取消";
                // if (item.INPSRC.trim() == "A") item.INPSRC = "支付宝";
                // if (item.INPSRC.trim() == "D") item.INPSRC = "电话";
                // if (item.INPSRC.trim() == "F") item.INPSRC = "传真";
                // if (item.INPSRC.trim() == "G") item.INPSRC = "代理商";
                // if (item.INPSRC.trim() == "L") item.INPSRC = "拉卡啦";
                // if (item.INPSRC.trim() == "M") item.INPSRC = "邮寄";
                // if (item.INPSRC.trim() == "T") item.INPSRC = "POS机具";
                // if (item.INPSRC.trim() == "U") item.INPSRC = "银联POS分期";
                // if (item.INPSRC.trim() == "W") item.INPSRC = "网银";
                // if (item.INPSRC.trim() == "O") item.INPSRC = "其他";
            });
            this.tableData = [...res];
            // 翻页设置
            ChangePage(this, ['APPREF'], 'tableData');

            this.showTrial = true;
        },
        // 撤销盛情 3105
        async onCheXiao() {
            if (this.currentRow === null) {
                return this.$alert('请选择一条记录列表！', '按日贷款撤销申请提示！', {
                    confirmButtonText: '确定',
                    center: true,
                    customClass: 'warning ',
                    showClose: false,
                });
            }
            // 再次确定是否撤销
            const confirmResult = await this.$confirm(
                '此操作将对当前选择按日贷撤销申请, 是否继续?',
                '按日贷撤销申请提示',
                {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    customClass: 'warning', type: 'warning',
                },
            ).catch(err => err);
            if (confirmResult !== 'confirm') return this.$message.info('已取消按日贷撤销申请');


            // 3105 配置请求头
            const appBody_3105 = {
                CARDNBR: this.DailylistCancelForm.CARDNBR,
                APPREF: this.currentRow.APPREF,
                PINFLAG: this.pinFlag,
            };
            await this.get_3105(appBody_3105);
            if (!this._3105res) return false;
            // 判断当前选择条的状态,再确定是否执行下一步 //延期标识0-未延期  1-延期中
            // if(this._3105res.DLYFLAG.trim() == "0")
            // if(this._3105res.DLYFLAG.trim() == "1")
            // 状态 N-已请款待摊销 A-正常摊销 C-正常结束P-提前还款30-待请款90-已撤销
            if (this._3105res.STATUS.trim() != '30') {
                return this.$alert('状态不是待请款，不能撤销！', '按日贷款撤销！', {
                    confirmButtonText: '确定',
                    center: true,
                    customClass: 'warning ',
                    showClose: false,
                });
            }

            // console.log(this._3105res,"this._3105res")
            // 4095 配置请求头
            const appBody_4095 = {
                CARDNBR: this.DailylistCancelForm.CARDNBR,
                APPREF: this.currentRow.APPREF,
                OPERTP: 0, // 0:撤销1:全额提前还款2:部分提前款款3:延期4:提前还款试算5：延期撤销
                MPNBR: this._3105res.MPNBR,
                CNLFEE: 0,
                PINFLAG: this.pinFlag,
            };
            await this.get_4095(appBody_4095, '撤销申请');
        },
        // 延期 3105
        async onYanQi() {
            if (this.currentRow === null) {
                return this.$alert('请选择一条记录列表！', '按日贷款撤销延期提示！', {
                    confirmButtonText: '确定',
                    center: true,
                    customClass: 'warning ',
                    showClose: false,
                });
            }


            // 再次确定是否撤销
            const confirmResult = await this.$confirm(
                '此操作将对当前选择按日贷撤销延期, 是否继续?',
                '按日贷撤销延期提示',
                {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    customClass: 'warning', type: 'warning',
                },
            ).catch(err => err);
            if (confirmResult !== 'confirm') return this.$message.info('已取消按日贷撤销延期');


            // 3105 配置请求头
            const appBody_3105 = {
                CARDNBR: this.DailylistCancelForm.CARDNBR,
                APPREF: this.currentRow.APPREF,
                PINFLAG: this.pinFlag,
            };
            await this.get_3105(appBody_3105);
            // 判断当前选择条的状态,再确定是否执行下一步 //延期标识0-未延期  1-延期中
            if ((`${this._3105res.DLYFLAG}`).trim() == '0') {
                return this.$alert('当前选择未延期，无需撤销延期！', '按日贷款撤销！', {
                    confirmButtonText: '确定',
                    center: true,
                    customClass: 'warning ',
                    showClose: false,
                });
            }
            // if(this._3105res.DLYFLAG.trim() == "1")
            // 状态 N-已请款待摊销 A-正常摊销 C-正常结束P-提前还款30-待请款90-已撤销
            // if ((this._3105res.STATUS + "").trim() != "30")
            //   return this.$alert(`状态不是待请款，不能取消！`, "按日贷款撤销！", {
            //     confirmButtonText: "确定",
            //     center: true,
            //     type: "warning ",
            //     showClose: false
            //   });
            // 4095 配置请求头
            const appBody_4095 = {
                CARDNBR: this.DailylistCancelForm.CARDNBR,
                APPREF: this.currentRow.APPREF,
                OPERTP: 5, // 0:撤销1:全额提前还款2:部分提前款款3:延期4:提前还款试算5：延期撤销
                MPNBR: this._3105res.MPNBR,
                CNLFEE: 0,
                PINFLAG: this.pinFlag,
            };
            await this.get_4095(appBody_4095, '撤销延期');
        },
        // 请求 3105接口
        async get_3105(appBody_3105) {
            const result_3105 = await get_3xxx(
                '3105',
                '按日贷款撤销',
                appBody_3105,
                this,
                false,
            );
            if (!result_3105) return false;
            this._3105res = result_3105.body.appBody;
        },
        // 请求 4095接口
        async get_4095(appBody_4095, msg) {
            const result_4095 = await get_4xxx(
                '4095',
                '按日贷款撤销',
                appBody_4095,
                this,
            );
            if (!result_4095) return false;

            this._4095res = result_4095.body.appBody;
            this.$alert(`分期编号:[${this._4095res.APPREF}],按日贷${msg}操作成功 ！`, '按日贷撤销', {
                confirmButtonText: '确定',
                center: true,
                customClass: 'success', type: 'success',
                showClose: false,
            });
            // 重新查询刷新页面
            this.onQuery();
        },
        // 重置
        onReset() {
            this.DailylistCancelForm.MPTYPE = 'W';
        },
        // 上下页切换
        handleChangePage(type) {
            this.currentRow = null;
            this.id = '';
            if (type === 'pre') {
                // 切换到上一页
                if (this.currentPageIndex - 2 < 0) {
                    this.pagingDataList = []; // 清空缓存 申请编号 -> 相当于首次查询

                    this.APPREF = '';
                    this.RTNIND = '';
                } else {
                    this.currentPageIndex = this.currentPageIndex - 2;
                    this.APPREF = this.pagingDataList[this.currentPageIndex].APPREF;
                }
                this.get_3046();
            } else {
                // 切换到下一页
                this.get_3046();
            }
        },
    },
};
</script>

<style  scoped lang="scss">
.dailylist_cancel-contnair {
    /deep/.el-card__header {
        padding: 8px !important;
    }
    /deep/.form-row {
        width: 100%;
        margin: 0 auto;
        .el-form {
            //   text-align: left;
            margin: 0 auto;
            // width: 500px;
            .el-form-item {
                text-align: left;
            }
        }

        .el-select {
            width: 100%;
            height: 42px;
        }
    }
    /deep/.el-radio__label {
        padding-left: 0;
    }
    .el-form-item {
        text-align: left;
    }
    /deep/.el-table .cell,
    .el-table th div,
    .el-table--border td:first-child .cell,
    .el-table--border th:first-child .cell {
        padding: 0;
        margin: 0 auto;
    }
    .el-row {
        height: 35px;
    }
    .footer {
        text-align: center;
        margin-top: 10px;
    }
}
</style>
